<template>
	<view class="userInfo">
		<image class="image" :src="userInfo.photo || user.photo"></image>
		<view :class="['title', {'active': userInfo.name}]">{{userInfo.name || user.name}}</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	export default {
		data() {
			return {
				user: {
					name: '请登陆系统',
					photo: require('@/static/user.png')
				}
			}
		},
		computed:{
			...mapState('user', ['userInfo'])
		},
		methods:{
			
		}
	}
</script>

<style lang="less" scoped>
	.userInfo{
		padding:66rpx 0;
		text-align: center;
		.image{
			width: 176rpx;
			height: 176rpx;
			border-radius: 50%;
		}
		.title{
			font-size: 44rpx;
			text-align: center;
			color:#999999;
			&.active{
				color:#333;
			}
		}
	}
</style>
